{extend name="../../base/view/common/base" /}
<!-- 主体 -->
{block name="body"}
<style>
    .layui-laydate-header {
        display: none;
    }

    .layui-laydate-content > table > thead {
        display: none;
    }

    .laydate-day-prev {
        display: none;
    }

    .laydate-day-next {
        display: none;
    }

    .pl_btn {
        color: #4c9cfb !important;
        cursor: pointer;
    }
    .countBan {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: flex-end;
    }

    .count_item_show {
        display: flex;
        margin: 10px;
        align-content: center;
        align-items: center;
    }
</style>
<form class="layui-form p-4">
    <h3 class="pb-3">功能菜单/节点</h3>
    <table class="layui-table layui-table-form">
        <td class="layui-td-gray">销售单位</td>
        <td>
            <select name="saleUnitId" lay-search >
                <option value="">请选择销售单位</option>
                {volist name=":get_department()" id="vo"}
                <option value="{$vo.id}" {if isset($detail.saleUnitId) && $detail.saleUnitId==$vo.id} selected{/if}>{$vo.title}</option>
                {/volist}
            </select>
        </td>
        <tr>
            <td class="layui-td-gray-2">单号<font>*</font>
            </td>
            <td>
                <input type="text" name="orderNum" value="{$detail.orderNum|default=''}" lay-verify="required" readonly
                       autocomplete="off" placeholder="请输入"
                       class="layui-input disabled">
            </td>
            <td class="layui-td-gray">供应商<font>*</font>
            </td>
            <td>
                <select name="punterId" id="punterId" lay-search lay-filter="punterId">
                    <option value="">选择供应商</option>
                    {volist name='punterList' id='pl'}
                    <option value="{$pl.id}" {if isset($detail.punterId)&&$detail.punterId==$pl.id} selected {/if}>{$pl.name}</option>
                    {/volist}
                </select>
            </td>
            <td class="layui-td-gray">单据日期<font>*</font></td>
            <td>
                <input type="text" name="orderDate" id="orderDate" value="{$detail.orderDate|default=date('Y-m-d')}" lay-verify="required" readonly
                       autocomplete="off" placeholder="选择日期"
                       class="layui-input">
            </td>
        </tr>
        <tr>
            <td class="layui-td-gray-2">入库人</td>
            <td>{$detail.checkName|default=''}</td>

            <td class="layui-td-gray-2">入库时间</td>
            <td>{$detail.checkTime|default=''}</td>
            <td class="layui-td-gray-2">状态</td>
            <td>
                <select name="" id="" disabled>
                {foreach ['1'=>'草稿','2'=>'已确认'] as $k=>$v}
                    <option value="{$k}" {if isset($detail.status)&&$detail.status ==$k} selected {/if}>{$v}</option>
                 {/foreach}
            </select>
            </td>
        </tr>
        <tr>
            <td class="layui-td-gray-2">备注</td>
            <td><input type="text" name="remark"  value="{$detail.remark|default=''}" lay-verify="required"
                       autocomplete="off" placeholder="请输入"
                       class="layui-input"></td>
        </tr>
        <tr>
            <td colspan="6"><h4>明细</h4></td>
        </tr>
        <tr>

            <td colspan="6">
                <table class="layui-table tableMany">
                    <thead>
                    <tr>
                        <td>序号</td>
                        <td>物料编码</td>
                        <td>品牌</td>
                        <td>品名</td>
                        <td>型号</td>
                        <td>订货号</td>
                        <td>单位</td>
<!--                        <td>仓库</td>-->
                        <td>入库数量</td>
                        <td>关联采购合同</td>
                        <td>关联销售合同</td>
                        <td>货商合同</td>
                        <td>客户</td>
                        <td>备注</td>
                        <td>操作</td>
                    </tr>
                    </thead>
                    <tbody id="mxTbdy">
                    {volist name="mxList" id="ml" key='k'}
                    <tr>
                        <td>
                            <span class="xuhao">{$k}</span>
                            <input type="hidden" name="mx[mxid][]" value="{$ml.id}">
                            <input type="hidden" class="mx_mdId" name="mx[mdId][]" value="{$ml.mdId}">
                            <input type="hidden" class="mx_thisId" name="mx[thisId][]" value="{$ml.thisId}">
                            <input type="hidden" class="" name="mx[wId][]" value="{$ml.wId}">
                            <input type="hidden" name="mx[saleContractDetailId][]" class="saleContractDetailId" value="{$ml.saleContractDetailId}">
                        </td>
                        <td>{$ml.bar_code}</td>
                        <td>{$ml.brand}</td>
                        <td>{$ml.mdName}</td>
                        <td>{$ml.specs}</td>
                        <td>{$ml.buyCode}</td>
                        <td>{$ml.unit}</td>
<!--                        <td>-->
<!--                            <select name="mx[wId][]" lay-filter="mdWid">-->
<!--                                <option value="">选择仓库</option>-->
<!--                                {volist name="warehouse" id="wl"}-->
<!--                                <option value="{$wl.id}" {if $ml.wId ==$wl.id} selected {/if}>{$wl.name}</option>-->
<!--                                {/volist}-->
<!--                            </select>-->
<!--                        </td>-->
                        <td><input type="text" name="mx[num][]" value="{$ml.num}" class="layui-input num" onblur="getMoneys(this)"
                                   lay-verify="required" oninput="digitalFiltering(this,2)"></td>
                        <td><input type="text" name="mx[saleContractOrder][]" class="layui-input" value="{$ml.saleContractOrder}" readonly></td>
                        <td><input type="text" name="" class="layui-input" value="{$ml.xsHt}" readonly></td>
                        <td><input type="text" name="" class="layui-input" value="{$ml.hsContract}" ></td>
                        <td><input type="text" name="" class="layui-input" value="{$ml.pName|default=''}" readonly></td>
                        <td><input type="text" name="mx[sodRemark][]" class="layui-input" value="{$ml.sodRemark}" ></td>

                        <td>
                            {if !isset($detail.status)||$detail.status==1}
<!--                            <a href="javascript:" class="layui-btn layui-btn-xs layui-btn-danger"-->
<!--                               onclick="delMx('{$ml.id}',this)">删除</a>-->
                            {/if}
                        </td>
                    </tr>
                    {/volist}
                    </tbody>
                </table>

            </td>
        </tr>
        <tr>
            <td colspan="17">
                <div class="countBan">
                    <div class="count_item_show">数量合计：<span id="numCount">0</span></div>
                </div>
            </td>
        </tr>
    </table>
</form>
{/block}
<!-- /主体 -->

<!-- 脚本 -->
{block name="script"}
<script>
    const moduleInit = ['tool'];
    let contactList=[];
    let saveList=[];
    let punterId="{$detail.punterId|default=''}"
    function gouguInit() {
        var form = layui.form, tool = layui.tool, level = 0, laydate = layui.laydate;
        //监听提交
        form.on('submit(webform)', function (data) {
            let callback = function (e) {
                layer.msg(e.msg);
                if (e.code == 0) {
                    setTimeout(function () {
                        parent.parent.location.reload();
                    }, 1000);
                }
            }
            tool.post("{:url('add')}", data.field, callback);
            return false;
        });



        form.on('select(punterId)', function (data) {
            console.log('data',data)
            getPunterMember(data.value);
        });

        form.on('select(contactId)', function (data) {
            let value=data.value;
            if (data.value==''){
                $("input[name ='contactName']").val();
                $("input[name ='contactPhone']").val();
            }else {
                contactList.forEach(function (item) {
                    if (item.id==value){
                        $("input[name ='contactName']").val(item.name);
                        $("input[name ='contactPhone']").val(item.phone);
                        return;
                    }
                })
            }
        });

        form.on('select(saveId)', function (data) {
            let value=data.value;
            if (data.value==''){
                $("input[name ='saveName']").val();
                $("input[name ='savePhone']").val();
                $("input[name ='saveAdd']").val();
            }else {
                saveList.forEach(function (item) {
                    if (item.id==value){
                        $("input[name ='saveName']").val(item.name);
                        $("input[name ='savePhone']").val(item.phone);
                        $("input[name ='saveAdd']").val(item.address);
                        return;
                    }
                })
            }
        });
        laydate.render({
            elem:"#orderDate"
        })

        // form.on('select(mdWid)', function (data) {
        //     let value=data.value;
        //     let that=data.othis;
        //     let trObj = $(that).parent().parent();
        //     let mdId=trObj.find('.mx_mdId').val();
        //     let saleContractDetailId=trObj.find('.saleContractDetailId').val();
        //     let param={
        //         mdId:mdId,
        //         saleContractDetailId:saleContractDetailId,
        //         wId:value
        //     };
        //     httpRequest("{:url('api/geKcMxInfo')}",param,function (res) {
        //         if (res.code==0){
        //             let data=res.data;
        //             let outNum=data.outNum;
        //             if (!outNum){
        //                 outNum=0;
        //             }
        //             let kcNum=parseFloat(data.num-outNum)
        //             trObj.find('.ckNum').val(kcNum);
        //             trObj.find('.occupyNum').val(data.lockNum);
        //             trObj.find('.mx_thisId').val(data.id);
        //         }
        //     },false)
        // });
        getPunterMember(punterId);
        getCounts();
    }

    let mxIndex = '';

    function saveAddMx(ojb) {
        var lastListItem = $('.tableMany tr:last');
        let aa = $(lastListItem).find(".xuhao")
        layer.close(mxIndex)
        console.log('aaa', ojb)
        let len = $(aa).text()
        if (!parseInt(len)) {
            len = 0;
        }
        let index = parseInt(len) + 1;
        let str = '';
        for (var i = 0; i < ojb.length; i++) {
            let item = ojb[i];
            str += '    <tr>\n' +
                '                        <td>\n' +
                '                            <span class="xuhao">'+index+'</span>\n' +
                '                            <input type="hidden" name="mx[mxid][]" value="">\n' +
                '                            <input type="hidden" class="mx_thisId" name="mx[thisId][]" value="">\n' +
                '                            <input type="hidden" class="" name="mx[wId][]" value="1">\n' +
                '                            <input type="hidden" class="mx_mdId" name="mx[mdId][]" value="'+item.mdId+'">\n' +
                '                            <input type="hidden" class="saleContractDetailId" name="mx[saleContractDetailId][]" value="'+item.id+'">\n' +
                '                        </td>\n' +
                '                        <td>'+item.bar_code+'</td>\n' +
                '                        <td>'+item.brand+'</td>\n' +
                '                        <td>'+item.mdName+'</td>\n' +
                '                        <td>'+item.specs+'</td>\n' +
                '                        <td>'+item.buyCode+'</td>\n' +
                '                        <td>'+item.unit+'</td>\n' +
                '                       <td><input type="text" name="mx[num][]" value="'+item.unInNum+'" class="layui-input num" onblur="getMoneys(this)"\n' +
                '                                   lay-verify="required" oninput="digitalFiltering(this,2)"></td>\n' +
                '                        <td><input type="text" name="mx[saleContractOrder][]" class="layui-input" value="'+item.orderNum+'" readonly></td>\n' +
                '                        <td>\n' +
                '                            {if !isset($detail.status)||$detail.status==1}\n' +
                '                            <a href="javascript:" class="layui-btn layui-btn-xs layui-btn-danger"\n' +
                '                               onclick="delMx(\'\',this)">删除</a>\n' +
                '                            {/if}\n' +
                '                        </td>\n' +
                '                    </tr>';
            index++;
        }
        $("#mxTbdy").append(str)
      layui.form.render();
    }

    function delMx(id = '', e) {
        if (id == '') {
            $(e).parent().parent().remove()
            return;
        }
        $.ajax({
            url: "{:url('removeMx')}",
            type: 'post',
            dataType: 'json',
            data: {id: id},
            success: function (res) {
                if (res.code != 0) {
                    layer.msg(res.msg)
                } else {
                    $(e).parent().parent().remove()
                }
            },
            error(e) {
                layer.msg('网络错误，请稍后')
            }
        })
    }

    function getMoneys(ojb) {
        let trObj = $(ojb).parent().parent();
        let occupyNum = trObj.find(".occupyNum").val()
        if (occupyNum==''){
            occupyNum=0;
        }
        console.log('aaaa',parseFloat(occupyNum))
        let num = trObj.find(".num").val()
        if (parseFloat(num)>parseFloat(occupyNum)){
            layer.msg('出库数量不能大于占用库存')
            trObj.find(".num").val('')
        }
    }

    function getPunterMember(punterId='') {
        $("#contactId").empty();
        $("#saveId").empty();
        $("input[name ='contactName']").val();
        $("input[name ='contactPhone']").val();
        $("input[name ='saveName']").val();
        $("input[name ='savePhone']").val();
        $("input[name ='saveAdd']").val();
        contactList=[];
        saveList=[];
        if (punterId==''){
            layui.form.render();
            return;
        }
        httpRequest("{:url('api/getPurveyorMember')}",{purveyorId:punterId},function (res) {
            if (res.code==0){
                 contactList=res.data.contactList;
                saveList=res.data.saverList;
                let contactStr='  <option value="">请选择</option>';
                let saverStr='  <option value="">请选择</option>';
                let contactId="{$detail.contactId|default='0'}"
                let saveId="{$detail.saveId|default='0'}"
                contactList.forEach(function (item) {
                    let cStr='';
                    if (item.id==contactId){
                        cStr='selected';
                    }
                    contactStr+='  <option value="'+item.id+'" '+cStr+'>'+item.name+'</option>'
                })
                saveList.forEach(function (item) {
                    let s_Str='';
                    if (item.id==saveId){
                        s_Str='selected';
                    }
                    saverStr+='  <option value="'+item.id+'" '+s_Str+'>'+item.name+'</option>'
                })
                console.log(saverStr)
                $("#contactId").append(contactStr);
                $("#saveId").append(saverStr);
                layui.form.render();
            }else {

            }
        },false)
    }

    function getDepartUser(departId='') {
        $("#saleId").empty();
        if (departId==''){
            layui.form.render();
            return;
        }
        httpRequest("{:url('api/getDepartUser')}",{did:departId},function (res) {
            if (res.code==0){
                let data=res.data;
                let saleStr='';
                let saleId="{$detail.saleId|default='0'}"
                data.forEach(function (item) {
                    let sstr='';
                    if (item.id==saleId){
                        sstr='selected';
                    }
                    saleStr+=' <option value="'+item.id+'" '+sstr+'>'+item.name+'</option>';
                })

                $("#saleId").append(saleStr);
                layui.form.render();
            }
        },false)
    }

    function getBjd() {
        let khId=$("#punterId").val();
        if (khId==''){
            layer.msg('请选择供应商');
            return
        }
        boxModel("{:url('saleContract')}?khId="+khId,'关联采购合同','1000')
    }

    function onSure() {
httpRequest("{:url('onSure')}",{id:"{$id}"},function (res) {
if (res.code==0){
    parent.parent.location.reload();
}
})
    }
    function onCancel() {
httpRequest("{:url('onCancel')}",{id:"{$id}"},function (res) {
if (res.code==0){
    parent.parent.location.reload();
}
})
    }
    function getCounts() {
        console.log('aaaaacont')
        let nums = 0;
        let moneys = 0;
        $('.num').each(function () {
            let thisNum = $(this).val();
            if (thisNum == '') {
                thisNum = 0;
            }
            thisNum = parseFloat(thisNum)
            nums += thisNum;
        })

        $('#numCount').text(nums)
    }
</script>
{/block}
<!-- /脚本 -->